<template>
  <!--通用弹窗-->
  <BasicModal v-bind="$attrs" @register="register" :title="modalTitle" :width="800" @ok="handleOk" :destroyOnClose="true" :canFullscreen="true">
    <BasicForm @register="registerForm" class="performanceForm" />
  </BasicModal>
</template>

<script setup>
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import { BasicForm, useForm } from '/@/components/Form/index';
  import { ref } from 'vue';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { editForm } from './relationship.data';
  import { singleUpdate } from './service';

  const { createMessage: msg } = useMessage();
  const emit = defineEmits(['success', 'register']);
  let modalTitle = ref('编辑');
  // @ts-ignore 提取表单参数

  let formSchemas = {
    labelCol: {
      span: 6,
    },
    wrapperCol: {
      span: 17,
    }, //表单布局
    schemas: editForm,
    showActionButtonGroup: false,
  };
  //注册表单
  const [
    registerForm,
    // eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
    { resetFields = () => {}, setFieldsValue = (p) => {}, updateSchema = (p) => {}, validate = () => {}, clearValidate = () => {} },
  ] = useForm(formSchemas);
  //注册弹窗对象 挂载关闭弹窗方法
  // eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
  const [register, { closeModal = () => {}, setModalProps = (p) => {} }] = useModalInner(async (data) => {
    resetFields(); //清空表单
    setFieldsValue({
      ...data.record,
      epmPerson1Code: data.record.epmPerson1,
      epmPerson1: data.record.epmPerson1Name,
      epmPerson2Code: data.record.epmPerson2,
      epmPerson2: data.record.epmPerson2Name,
    });
  });

  /**
   * 弹窗保存
   */
  async function handleOk() {
    try {
      let values = await validate();
      values.epmPerson1 = values.epmPerson1 === values.epmPerson1Name ? values.epmPerson1Code : values.epmPerson1;
      values.epmPerson1Code = null;
      values.epmPerson1Name = null;
      values.epmPerson2 = values.epmPerson2 === values.epmPerson2Name ? values.epmPerson2Code : values.epmPerson2;
      values.epmPerson2Code = null;
      values.epmPerson2Name = null;
      setModalProps({ confirmLoading: true });
      await singleUpdate(values);
      closeModal();
      emit('success');
    } finally {
      setModalProps({ confirmLoading: false });
    }
  }
</script>

<style lang="less">
  .performanceForm {
    .ant-input-number {
      width: 100%;
    }
    .ant-picker {
      width: 50%;
    }
  }
  .title {
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 1px;
    color: #5c5b5b;
  }
</style>
